@charset "utf-8";

.siginWall{height: 562px; overflow: hidden; position: absolute; top: 0; left: 0; z-index: 1; padding: 0 24px; display: none;}
.siginWall ul{height: 562px; margin: 0 auto; padding-top: 30px;}
.siginWall li{width: 112px; height: 112px; float: left; margin: 0 10px 21px 11px; position: relative; }
.siginWall .play{width: 102px; height: 102px; background: url(../common/images/checkInDefault.png) no-repeat center; border-width: 5px; border-style: solid; position: absolute; top: 0; left: 0; z-index: 1;}
.siginWall .avatar img{width: 102px; height: 102px; display: block;}
.siginWall .avatar p{width: 148px; height: 40px; line-height: 40px; font-size: 26px; text-align: center; background: rgba(0, 0, 0, 0.6); position: absolute; bottom: 0; display: none;overflow:hidden;}
.siginWall li.animation .play{width: 148px; height: 148px; border-width: 4px; border-style: solid; left: -22px; top: -22px; z-index: 2;}
.siginWall li.animation .avatar img{width:148px; height:148px}
.siginWall li.animation .play p{display: block;}
.siginWall li.animation .siginWords{display: block;}
.siginWords{width: 264px; max-width:492px;height: auto; font-size: 48px; color: #464646; background: #fff; border: 3px solid #cbcbcb; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; position: absolute; z-index: 2; display:none;}
.siginWords p{max-height: 110px; word-break: break-word; padding:13px 12px;  overflow:hidden;}
.siginWords i{position:absolute; display:inline-block; background:url(../common/images/siginWord.png) no-repeat;}
.siginWords i.leftside,.siginWords i.rightside{width:13px; height:18px;}
.siginWords i.topside,.siginWords i.bottomside{ width:18px; height:13px;}
.siginWords i.leftside{ background-position:right center; top:50%; left:-13px; margin-top:-9px}
.siginWords i.rightside{ background-position:left center; top:50%; right:-13px; margin-top:-9px}
.siginWords i.bottomside{ background-position:center bottom; top:-13px; left:50%; margin-left: -9px;}
.siginWords i.topside{ background-position:center top; bottom:-13px; left:50%; margin-left: -9px;}
.wordsLeft{right: 166px; top: -9px; }
.wordsRight{left: 166px; top: -9px;}
.wordstop{bottom: 166px; left: -40%; }
.wordsbottom{top: 166px; left:-40%;}
